<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>我的订单 - 恩爸商城</title>
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/myOrders.css">
</head>
<body>
    <!-- 头部 -->
    <div class="header">
        <div class="container">
            <div class="logo">
                <a href="index.html">恩爸商城</a>
            </div>
            <div class="page-title">我的订单</div>
        </div>
    </div>

    <!-- 主要内容 -->
    <div class="main">
        <div class="container">
            <!-- 订单状态标签 -->
            <div class="order-tabs">
                <div class="tab-item active" data-status="all">全部订单</div>
                <div class="tab-item" data-status="unpaid">待付款</div>
                <div class="tab-item" data-status="unshipped">待发货</div>
                <div class="tab-item" data-status="shipped">待收货</div>
                <div class="tab-item" data-status="completed">已完成</div>
            </div>

            <!-- 订单列表 -->
            <div class="order-list">
                <!-- 订单列表将由 JavaScript 动态生成 -->
            </div>
        </div>
    </div>

    <!-- 页脚 -->
    <div class="footer">
        <div class="container">
            <div class="copyright">
                Copyright © 2024 恩爸商城 All Rights Reserved
            </div>
        </div>
    </div>

    <script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
    <script src="js/orderData.js"></script>
    <script type="module" src="js/myOrders.js"></script>
</body>
</html> 